<template>
	<view class="menu_box">
		<menuHeader :user="hdUser" :infoState="scrollTopState"></menuHeader>
		<view class="menu_content">
			<menuContent :content="menuData"></menuContent>
		</view>
		<!-- 评论 -->
		<view class="menu_comment">
			<compComment :noteComment="comment"></compComment>
			<view class="more" v-if="comment.cc >3" @tap="getComment(_id,0,20)">
				查看全部{{comment.cc}}条评论
			</view>
		</view>
		<!-- 回复评论 -->
		<view class="menu_reply">
			<compReply></compReply>
		</view>
	</view>
</template>

<script>
	import menuHeader from '../../../components/menuHeader/menuHeader.vue';
	import menuContent from '../../../components/menuContent/menuContent.vue';
	import compComment from '../../../components/compComment/compComment.vue';
	import compReply from '../../../components/compReply/compReply.vue';
	export default {
		data() {
			return {
				hdUser: null, //
				menuData: null, //
				comment: null, //评论数据
				_id: null,
				scrollTopState:false,
			};
		},
		components: {
			menuHeader,
			menuContent,
			compComment,
			compReply
		},
		onLoad(option) {
			console.log('参数---->', option);
			this._id = option.value
			this.getData(option.value);
			this.getComment(option.value, 0, 3)
		},
		onPageScroll(e) {
			if (e.scrollTop > 100) {
				this.scrollTopState = true
			}else{
				this.scrollTopState = false
			}
		},
		methods: {
			getData(k) {
				this.$axios(`recipe/detail/${k}`).then(res => {
					console.log(res.result.recipe);
					this.hdUser = res.result.recipe.user;
					this.menuData = res.result.recipe
				})
			},
			getComment(k, j, m) {
				this.$axios(`recipe/flatcomments/${k}/${j}/${m}`).then(res => {
					this.comment = res.result
					// console.log(res.result.cc)
				})
			}
		}
	}
</script>

<style lang="scss">
	.menu_box {
		width: 100%;
		height: 100%;
		padding-bottom: 200rpx;
	}

	.menu_comment {
		width: 100%;

		.more {
			width: 92%;
			margin: 0 auto;
			padding-bottom: 30rpx;
			text-align: center;
			font-size: 26rpx;
			color: #50959F;
			font-weight: bold;
		}
	}
</style>
